.button {
	.box-round;
	// .flex-wrap-center; // 安卓4.x兼容问题，文字不能剧中
	.text-align-v(middle); // a.button 垂直居中
	display: inline-block;
	text-align: center;

	padding: 0 10px;
	height: 40px;
	color: @btnTxtColor;
	border: 1px solid @btnBorderColor;
	background: @btnBg;
	outline: none;
	font-size: @l2;
	position: relative;
	overflow: hidden;

	* {
		display: inline-block;
	}
	&.no-padding {
		padding: 0;
	}
	// 电子签名按钮
	&.sign {
		height: 72px;
		.flex-1;
	}
	&.is-left {
		justify-content: flex-start;
	}
	&.is-right {
		justify-content: flex-end;
	}
	// 文字按钮
	&.is-text {
		background: transparent !important;
		border: none !important;
		color: @btnTxtColorPlain;
		i {
			font-size: 1.2em;
		}
	}
	// 朴素按钮
	&.is-plain {
		background: @btnBgPlain;
		color: @btnTxtColorPlain;
	}
	// 主要按钮
	&.primary {
		border-color: @btnBorderColorPrimary;
		background: @btnBgPrimary;
		color: @btnTxtColorPrimary;
		&.is-plain,
		&.is-text {
			background: @btnBgPrimaryPlain;
			color: @btnTxtColorPrimaryPlain;
		}
	}
	// 成功按钮
	&.success {
		border-color: @btnBorderColorSuccess;
		background: @btnBgSuccess;
		color: @btnTxtColorSuccess;
		&.is-plain,
		&.is-text {
			background: @btnBgSuccessPlain;
			color: @btnTxtColorSuccessPlain;
		}
	}
	// 信息按钮
	&.info {
		border-color: @btnBorderColorInfo;
		background: @btnBgInfo;
		color: @btnTxtColorInfo;
		&.is-plain,
		&.is-text {
			background: @btnBgInfoPlain;
			color: @btnTxtColorInfoPlain;
		}
	}
	// 警告按钮
	&.warning {
		border-color: @btnBorderColorWarning;
		background: @btnBgWarning;
		color: @btnTxtColorWarning;
		&.is-plain,
		&.is-text {
			background: @btnBgWarningPlain;
			color: @btnTxtColorWarningPlain;
		}
	}
	// 危险按钮
	&.danger {
		border-color: @btnBorderColorDanger;
		background: @btnBgDanger;
		color: @btnTxtColorDanger;
		&.is-plain,
		&.is-text {
			color: @btnTxtColorDanger;
			background: @btnBgDangerPlain;
			color: @btnTxtColorDangerPlain;
		}
	}
	// 禁用按钮
	&[disabled] {
		border-color: @btnBorderColorDisabled;
		background: @btnBgDisabled;
		color: @btnTxtColorDisabled;
	}
	// 中等按钮
	&.is-md {
		height: 36px;
		font-size: @l3;
	}
	// 小型按钮
	&.is-sm {
		height: 32px;
		font-size: @l3;
	}
	// 超小按钮
	&.is-mini {
		height: 28px;
		font-size: @l4;
	}
	// 圆角按钮
	&.is-round {
		border-radius: 20px;
	}
	// 圆圈按钮
	&.is-circle {
		.flex-wrap-center;
		overflow: hidden;
		border-radius: 50%;
		width: 40px;
		&.is-md {
			width: 36px;
		}

		&.is-sm {
			width: 32px;
		}

		&.is-mini {
			width: 28px;
		}
	}
}

.form-bar {
	.button {
		width: 100%;
		margin-top: 10px;
		&:last-child {
			margin-bottom: 10px;
		}
	}
}
.button-bar {
	display: flex;
	.button,
	.item {
		flex: 1;
		margin-right: 10px;
		&:last-child {
			margin-right: 0;
		}
	}
}
.button-group {
	display: flex;
	.button {
		border-radius: 0;
		flex: 1;
		margin-right: 1px;
		&.is-text {
			.r-line;
			margin-right: 0;
		}
		&:last-child {
			.no-line;
			margin-right: 0;
		}
	}
	&.is-round {
		.button {
			&:first-child {
				border-top-left-radius: 20px;
				border-bottom-left-radius: 20px;
			}
			&:last-child {
				border-top-right-radius: 20px;
				border-bottom-right-radius: 20px;
			}
		}
	}
}
